<template>
	<view class="main-box">
		<image mode="widthFix" class="logo" src="https://h5.sx2b2c.com/images/xima_laya/logo.png"></image>
		<view class="content">您即将跳转至喜马拉雅的服务，会使用您当前手机号查询对应喜马拉雅账号的签约情况判断活动资格，符合活动资格后，您可以开通喜马拉雅的连续包月服务</view>
		<view class="submit-btn" @click="submit">{{sendCodeDownNumber}}s 后跳转</view>
		<view class="wait-btn" @click="waitHandler">再想想</view>
	</view>
</template>

<script>
	import logApi from '@/api/logApi';
	import userApi from '@/api/userApi';
	import countDownUtil from '@/utils/countDownUtil';
	import httpUtil from '@/utils/httpUtil';
	import messageUtil from '@/utils/messageUtil';
	import validParamsUtil from '@/utils/validParamsUtil';
	import ximaLayaShengHeApi from "@/api/ximaLayaShengHeApi.js"

	export default {
		data() {
			return {
				mobile: '',
				sendCodeDownNumber: 3,
				openidHF: '',
				intervalId: '',
				isSubmit:false, // 是否已经提交过
			};
		},
		onLoad(option) {
			this.initData(option)
		},
		onShow() {
			this.checkOrderStatus()
		},
		methods: {
			initData(option) {
				if (option.openidHF) {
					this.openidHF = option.openidHF
				}

				this.mobile = option.mobile

				if (this.mobile) {
					this.sendCodeDownNumber = 3;
					countDownUtil.start(this.sendCodeDownNumber, res => {
						this.sendCodeDownNumber = res;
					})

					setTimeout(() => {
						this.submit()
					}, 2000)
				}

			},
			checkOrderStatus() {
				if (this.mobile && this.isSubmit) {
					messageUtil.showLoading('订单确认中')
					this.intervalId = setInterval(() => {
						this.checkOrderStatusHandler()
					}, 1500)

					setTimeout(() => {
						messageUtil.closeLoading()
						this.clearCheckOrderStatus()
					}, 10000)
				}
			},
			clearCheckOrderStatus() {
				if (this.intervalId) {
					clearInterval(this.intervalId)
				}
			},
			checkOrderStatusHandler() {
				if (!validParamsUtil.validPhone(this.mobile)) {
					logApi.addLog('checkOrderStatusRequest,手机号不正确' + userApi.getMobile())
					return;
				}

				let queryMobileParmas = {
					mobile: this.mobile
				}
				logApi.addLog('checkOrderStatusRequest,检查订单是否支付，请求：' + JSON.stringify(queryMobileParmas))

				httpUtil.post('/api/xmly/queryMobile', queryMobileParmas, res => {
					logApi.addLog('checkOrderStatusRequest,检查订单是否支付，返回：' + JSON.stringify(res))
					if (res.data.sign) {
						this.clearCheckOrderStatus()
						uni.navigateTo({
							url: '/pages/xmly/xmly'
						})
					}
				})

			},
			submit() {
				console.log('submit')
				messageUtil.showLoading()
				let params = {
					a: httpUtil.getA(),
					mobile: this.mobile,
					openid: userApi.getUserId(),
					param: ximaLayaShengHeApi.getParam(),
					type: 1,

				}
				// #ifdef MP-WEIXIN
				params.env = 'mini'
				// #endif
				messageUtil.showLoading()
				logApi.addXmlyLog('提交订单之前，请求参数' + JSON.stringify(params))
				httpUtil.post("/api/xmly/api_order", params, res => {
					messageUtil.closeLoading()
					this.isSubmit = true
					logApi.addXmlyLog('提交订单之后，请求参数' + JSON.stringify(params) + '。返回：' + JSON.stringify(res))
					
					let extraData = JSON.parse(res.data.payInfo)
					wx.navigateToMiniProgram({
						appId: 'wxbd687630cd02ce1d',
						extraData,
						success(res) {
							// setInterval(() => {
							// 	ximaLayaShengHeApi.checkOrderIsSuccess(params.mobile,
							// 		res => {
							// 			if (res.data.sign) {
							// 				uni.navigateTo({
							// 					url: '/pages/xmly/xmly'
							// 				})
							// 			}
							// 		})
							// }, 3000)
							this.checkOrderStatus()
						},
						fail(res) {

						}
					})


				}, err => {

				})

			},
			waitHandler() {
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss">
	.main-box {
		display: flex;
		justify-content: center;
		align-items: center;
		min-height: 100vh;
		flex-direction: column;
	}

	.logo {
		width: 144rpx;
		height: auto;
		display: block;
		margin-top: -100rpx;
	}

	.content {
		width: 579rpx;
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #333333;
		margin-top: 68rpx;
	}

	.submit-btn {
		width: 278rpx;
		height: 72rpx;
		background: #48C164;
		border-radius: 5rpx;
		text-align: center;
		margin-top: 68rpx;
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 34rpx;
		color: #FFFFFF;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.wait-btn {
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 34rpx;
		color: #808080;
		margin-top: 31rpx;
	}
</style>